<template>
  <div>
    <el-header style="text-align: right; height:70px; ">
      <title>未来媒体实验室</title>
      <span></span>
      <img src="../assets/hhh.jpg" height='69px' width="180px" style="float:left;opacity: 1;" alt="">
      <img src="../assets/wecom-temp.png" height='40px' width="500px" style="margin-bottom:12px;">
      <img src="../assets/img_touxiang_small@2x.png" height='60px' width="60px" style="margin-right:20px" alt="">
      <img src="@/assets/out.png" @click="logOut" style="width:30px;height: 30px; margin-bottom:12px;opacity: 0.8;margin-right:20px " />
      <!-- <el-button type="info" @click="logOut" size="mini">
        <img src="../assets/outLogin.png" style="width:19px;background-color: #fff;height: 15px;opacity: 1;">
      </el-button> -->
    </el-header>
  </div>
</template>                                           后台管理端

<script>
export default {
  name: 'HeaderTop',
  mounted() {
    let loginKey = localStorage.getItem('userInfo')
    if (loginKey) {
      this.userInfo = JSON.parse(localStorage.getItem('userInfo'))
      let logintime=this.userInfo.data.logintime
      let loginTime = new Date(logintime)
      let thisTime=new Date();
      if ((thisTime - loginTime) > 1000 * 60 * 60 * 24) {
        localStorage.removeItem('userInfo')
        this.$message.error('登陆超时！')
        setTimeout(() => {
          this.$router.push('/login')
        }, 2000)
      }
    } else {
      this.$message.error("请先登录！")
      setTimeout(() => {
        this.$router.push('/')
      }, 2000)
    }
  
  },
  methods: {
    logOut() {
      localStorage.removeItem('userInfo'),
        this.$router.push({
          path: '/login'
        })
    }
  },



}
</script>

<style scope>
.el-header {
  margin-left: 242px;
  background-color: #fff;
  /* background: linear-gradient(to top ,hsl(199, 72%, 53%),rgb(95, 140, 168)); */
  color: #fff;
  text-align: center;
  line-height: 80px;
  position: fixed;
  top: 0;
  width: 88%;
  z-index: 1000;
  border-bottom: 1px solid #cbc3c3;
  /* box-shadow: 0 2px 6px #bbb; */
}

.el-header span {
  font-size: large;
}
</style>